<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>活动详情</title>
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
		<!--<link rel="stylesheet" href="../css/common.css" />-->
		<link rel="stylesheet" href="../css/mui.min.css" />
		<!--<script type="text/javascript" src="../js/common.js" ></script>-->
		<script type="text/javascript" src="../js/jquery-2.1.0.js"></script>
		<script type="text/javascript" src="../js/mobile-detect.min.js"></script>
		<script type="text/javascript" src="../controll/mui.min.js"></script>
		<script type="text/javascript" src="../js/config.js"></script>
		<script type="text/javascript" src="../js/common.js"></script>
		<script type="text/javascript" src="../js/template-web.js" ></script>
	</head>
	<style>
		.banner {
			width: 100%;
		}
		
		input::-webkit-input-placeholder,
		textarea::-webkit-input-placeholder {
			font-size: 14px;
		}
		
		input:-moz-placeholder,
		textarea:-moz-placeholder {
			font-size: 14px;
		}
		
		input::-moz-placeholder,
		textarea::-moz-placeholder {
			font-size: 14px;
		}
		
		input:-ms-input-placeholder,
		textarea:-ms-input-placeholder {
			font-size: 14px;
		}
		
		.mui-input-row label {
			text-align: right;
			padding-right: 0;
			width: 30%;
		}
		
		.mui-input-row label~input {
			width: 68%;
		}
		.act_content{
			padding: 15px 5px;
		}
	</style>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">活动详情</h1>
		</header>
		<div class="mui-content">
			<script type="text/html" id="model">
				{{if status=="success"}}
				<img src="http://isv.tiaze.com{{data[0].image}}" class="banner">
				<div class="act_content">
					{{#data[0].content}}
				</div>
				<h3 style="padding-left: 10px;margin-bottom: 10px;">邀约人信息</h3>
				<form class="mui-input-group" style="font-size: 14px;">
					<div class="mui-input-row">
						<label class="text-right">商家名称：</label>
						<input type="text" class="mui-input-clear comment_content" placeholder="请输入商家名称" data-id="商家名称">
					</div>
					<div class="mui-input-row">
						<label>手机号码：</label>
						<input type="text" class="mui-input-clear comment_content" placeholder="请输入手机号码" data-id="手机号码">
					</div>
					<div class="mui-input-row">
						<label>微信号：</label>
						<input type="text" class="mui-input-clear comment_content" placeholder="请输入微信号码" data-id="微信号">
					</div>
					<div class="mui-input-row">
						<label>联系QQ：</label>
						<input type="text" class="mui-input-clear comment_content" placeholder="请输入QQ号码" data-id="联系QQ">
					</div>
					<div class="textarea" style="padding: 15px;">
						<!--<textarea rows="3" style="border: 1px solid #999;" class="comment_content" data-id="留言内容"></textarea>-->
						<button type="button" class="mui-btn mui-btn-success mui-btn-block submit" style="padding: 6px 12px;margin-top: 15px;">提交</button>
					</div>
				</form>
				{{/if}}
			</script>
		</div>

		<script>
			mui.init();
			mui.plusReady(function() {
				plus.nativeUI.showWaiting("数据加载中...");
				var self = plus.webview.currentWebview();
				var id = self.active_id;
				require(weburl + articleDetail, "json", "post", {
					token: localStorage.getItem("token"),
					id: id
				}, function(e) {
					plus.nativeUI.closeWaiting();
					console.log(JSON.stringify(e));
					var html=template("model",e);
					$(".mui-content").html(html);
				}, function() {
					plus.nativeUI.closeWaiting();
					mui.alert("网络错误"," ","关闭",function(){},"div");
				})
				mui("body").on("tap",".submit",function(){
					$("input").blur();
					var comment_content = $(".comment_content");
					var str = "";
					for(var i = 0; i < comment_content.length; i++) {
						if(!comment_content.eq(i).val()) {
							mui.alert(comment_content.eq(i).attr("data-id") + "不能为空！", " ", "确定", function() {}, "div");
							break;
						} else if(i == (comment_content.length - 1)) {
							str += comment_content.eq(i).attr("data-id") + ":" + comment_content.eq(i).val() + "|";
							require(weburl + addbook, "json", "post", {
								token: localStorage.getItem("token"),
								content: str.substring(0, str.length - 1)
							}, function(e) {
								mui.alert(e.msg, " ", "确定", function() {}, "div");
							})
						} else {
							str += comment_content.eq(i).attr("data-id") + ":" + comment_content.eq(i).val() + "|";
						}
					}

				})
			})
			
		</script>
	</body>

</html>